import React from "react";
import { Input, Form } from "antd";

const InputSearch = Input.Search;

@Form.create()
class QueryExtra extends React.Component {

  componentDidMount() {
    const { getFormThis } = this.props;
    if (getFormThis) getFormThis(this, "queryExtra");
  }

  handleSearch = value => {
    const { onSearch } = this.props;
    if (onSearch instanceof Function) onSearch(value);
  };

  handleReset = () => {
    const { form } = this.props;
    form.resetFields();
  };

  handleSubmit = e => {
    if (e && e.preventDefault) e.preventDefault();
    const { form, handleParamsChange } = this.props;
    form.validateFields((err, values) => {
      if (err) {
        return;
      }
      const { searchText = "" } = values;
      const param = { searchText: searchText.trim() };
      if (handleParamsChange) handleParamsChange(param);
    });
  };

  render() {
    const { form } = this.props;
    const { getFieldDecorator } = form;
    return (
      <Form layout='inline'>
        <Form.Item
          label=""
          labelCol={{ span: 1 }}
          wrapperCol={{ span: 23 }}
          style={{ marginRight: 0 }}
        >
          {getFieldDecorator("searchText", {
            initialValue: "",
          })(
            <InputSearch
              placeholder="请输入模板名称"
              onSearch={this.handleSearch}
              className='input__search'
              style={{ marginRight: 0 }}
            />,
          )}
        </Form.Item>
      </Form>
    );
  }
}

export default QueryExtra;